<!doctype html>
<!--[if lt IE 7]>
<html class="no-js lt-ie9 lt-ie8 lt-ie7" lang=""> <![endif]-->
<!--[if IE 7]>
<html class="no-js lt-ie9 lt-ie8" lang=""> <![endif]-->
<!--[if IE 8]>
<html class="no-js lt-ie9" lang=""> <![endif]-->
<!--[if gt IE 8]><!-->
<html class="no-js" lang=""> <!--<![endif]-->
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <title>Know Your Graph Home Page</title>
  <meta name="description" content="">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="apple-touch-icon" href="apple-touch-icon.png">

  <%= stylesheet_link_tag 'tpmo_css/bootstrap.min' %>
  <%= stylesheet_link_tag 'tpmo_css/bootstrap-theme.min' %>
  <%= stylesheet_link_tag 'tpmo_css/fontAwesome' %>
  <%= stylesheet_link_tag 'tpmo_css/templatemo-style' %>

  <link href="https://fonts.googleapis.com/css?family=Montserrat:100,200,300,400,500,600,700,800,900" rel="stylesheet">

  <!--<script src="js/vendor/modernizr-2.8.3-respond-1.4.2.min.js"></script>-->
  <%= javascript_include_tag 'tpmo_js/vendor/modernizr-2.8.3-respond-1.4.2.min' %>
</head>

<body>

<div class="overlay"></div>
<section class="top-part">
  <%#= video_tag 'tpmo_video/video', autoplay: :autoplay, loop: :loop  %>
  <video controls autoplay loop>
    <source src=" <%= video_url 'tpmo_video/video.mp4'%>" type="video/mp4">
    <!--<source src="videos/video.ogg" type="video/ogg">-->
    Your browser does not support the video tag.
  </video>
</section>

<section class="cd-hero">

  <div class="cd-slider-nav">
    <nav>
      <span class="cd-marker item-1"></span>
      <ul>
        <li class="selected"><a href="#0">
          <div class="image-icon">
            <!--<img src="img/home-icon.png">-->
            <%= image_tag 'tpmo_img/home-icon.png' %>
          </div>
          <h6>Welcome</h6></a></li>
        <li><a href="#0">
          <div class="image-icon">
            <!--<img src="img/about-icon.png">-->
            <%= image_tag 'tpmo_img/about-icon.png' %>
          </div>
          <h6>User</h6></a></li>
        <li><a href="#0">
          <div class="image-icon">
            <!--<img src="img/featured-icon.png">-->
            <%= image_tag 'tpmo_img/featured-icon.png' %>
          </div>
          <h6>Featured</h6></a></li>
        <li><a href="#0">
          <div class="image-icon">
            <!--<img src="img/projects-icon.png">-->
            <%= image_tag 'tpmo_img/projects-icon.png' %>
          </div>
          <h6>Projects</h6></a></li>
        <li><a href="#0">
          <div class="image-icon">
            <!--<img src="img/contact-icon.png">-->
            <%= image_tag 'tpmo_img/contact-icon.png' %>
          </div>
          <h6>Contact Us</h6></a></li>
      </ul>
    </nav>
  </div> <!-- .cd-slider-nav -->

  <ul class="cd-hero-slider">

    <li class="selected">
      <div class="heading">
        <h1>Know Your Graph</h1>
        <%= link_to user_console_index_path do %><span>Welcome To World of Computing Graph</span><% end %>
      </div>
      <!--<div class="cd-full-width first-slide">-->
        <!--<div class="container">-->
          <!--<div class="row">-->
            <!--<div class="col-md-12">-->
              <!--<div class="content first-content">-->
                <!--<h4>Let’s Talk More About Newline</h4>-->
                <!--<p>Newline is free CSS template by templatemo. Credits go to-->
                  <!--<a href="https://videos.pexels.com/videos/busy-street-in-the-city-1089" target="_blank">Pexels.com</a>-->
                  <!--for a video background and <a href="http://unsplash.com" target="_blank">Unsplash</a> for images.-->
                  <!--Please tell your friends about templatemo and this is a way to help back. Thank you. Lorem ipsum dolor-->
                  <!--sit amet, consectetur adipiscing elit. Quisque dictum convallis mi. In dapibus auctor dictum donec-->
                  <!--mattis quis eros ultricies feugiat.</p>-->
                <!--<div class="primary-button">-->
                  <!--<a href="#">Discover More</a>-->
                <!--</div>-->
              <!--</div>-->
            <!--</div>-->
          <!--</div>-->
        <!--</div>-->
      <!--</div>-->
    </li>
    <!--<div class="copyrights">Collect from <a href="http://www.cssmoban.com/">企业网站模板</a></div>-->

    <li>
      <div class="heading">
        <h1>User</h1>
        <span><%= link_to 'users/new' do %>Register<% end %> or <%= link_to users_login_url do %>login<% end %> to explore more functions</span>
      </div>
      <div class="cd-half-width second-slide">
        <div class="container">
          <!--<div class="row">-->
            <!--<div class="col-md-12">-->
              <!--<div class="content second-content">-->
                <!--<div class="row">-->
                  <!--<div class="col-md-7 left-image">-->
                    <!--&lt;!&ndash;<img src="img/left-about-image.jpg">&ndash;&gt;-->
                     <!--image_tag 'tpmo_img/left-about-image.jpg' %>-->
                  <!--</div>-->
                  <!--<div class="col-md-5">-->
                    <!--<div class="right-about-text">-->
                      <!--<h4>Who we are?</h4>-->
                      <!--<p>Fusce neque leo, dapibus sed imperdiet sed, vulputate sed purus. Nam eget justo in nibh-->
                        <!--facilisis rhoncus. Donec et risus non mauris lobortis convallis. Aliquam id urna quis ante-->
                        <!--blandit semper.</p>-->
                      <!--<div class="primary-button">-->
                        <!--<a href="#">Discover More</a>-->
                      <!--</div>-->
                    <!--</div>-->
                  <!--</div>-->
                <!--</div>-->
                <!--<div class="row">-->
                  <!--<div class="col-md-7">-->
                    <!--<div class="left-about-text">-->
                      <!--<h4>What we do?</h4>-->
                      <!--<p>Nam aliquam ultrices interdum. Vivamus metus mi, accumsan a tincidunt a, efficitur id felis.-->
                        <!--Vivamus non nibh malesuada, vestibulum nulla in, iaculis sem. Aenean tincidunt faucibus ipsum,-->
                        <!--ac aliquet nunc accumsan sed. Nulla sodales nunc sit amet libero egestas, ut interdum ex-->
                        <!--congue.</p>-->
                      <!--<div class="primary-button">-->
                        <!--<a href="#">Discover More</a>-->
                      <!--</div>-->
                    <!--</div>-->
                  <!--</div>-->
                  <!--<div class="col-md-5 right-image">-->
                    <!--&lt;!&ndash;<img src="img/right-about-image.jpg">&ndash;&gt;-->
                     <!--image_tag 'tpmo_img/right-about-image.jpg' %>-->
                  <!--</div>-->
                <!--</div>-->
              <!--</div>-->
            <!--</div>-->
          <!--</div>-->
        </div>
      </div>
    </li>

    <li>
      <div class="heading">
        <h1>Featured</h1>
        <span>We produce featured product every week</span>
      </div>
      <div class="cd-half-width third-slide">
        <div class="container">
          <div class="row">
            <div class="col-md-12">
              <div class="content third-content">
                <div class="row">
                  <div class="col-md-7 left-image">
                    <!--<img src="img/left-feature-image.png">-->
                    <%= image_tag 'tpmo_img/left-feature-image.png' %>
                  </div>
                  <div class="col-md-5">
                    <div class="right-feature-text">
                      <h4>Featured Product: <em>Newline</em></h4>
                      <p>Lorem ipsum dolor amet, consecte adipiscing elit, quisque dictum convallis mi. In dapibus
                        auctor dictum donec mattis quis eros ultricies feugiat. Morbi congue faucibus mi, ague blandit
                        curabitur ac lacinia.</p>
                      <div class="feature-list">
                        <ul>
                          <p>- Suspendisse mattis finibus sem</p>
                          <p>- Pellentesque et urna vel lectus</p>
                          <p>- Vestibulum iaculis nisi dui</p>
                          <p>- Donec sagittis eros , ac tempus ligula</p>
                          <p>- Integer sapien risus, auctor</p>
                        </ul>
                      </div>
                      <div class="primary-button">
                        <a href="#">Discover More</a>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </li>

    <li>
      <div class="heading">
        <h1>Our projects</h1>
        <span>Here you can check our recent projects</span>
      </div>
      <div class="cd-half-width fourth-slide">
        <div class="container">
          <div class="row">
            <div class="col-md-12">
              <div class="content fourth-content">
                <div class="row">
                  <div class="col-md-3 project-item">
                    <a href="<%= image_url 'tpmo_img/item-01.jpg'%>" data-lightbox="image-1">
                      <!--<img src="img/project-item-01.jpg">-->
                      <%= image_tag 'tpmo_img/project-item-01.jpg' %>
                    </a>
                  </div>
                  <div class="col-md-3 project-item">
                    <a href="<%= image_url 'tpmo_img/item-02.jpg'%>" data-lightbox="image-1">
                      <%= image_tag 'tpmo_img/project-item-02.jpg' %></a>
                  </div>
                  <div class="col-md-3 project-item">
                    <a href="<%= image_url 'tpmo_img/item-03.jpg'%>" data-lightbox="image-1"><%= image_tag 'tpmo_img/project-item-03.jpg' %></a>
                  </div>
                  <div class="col-md-3 project-item">
                    <a href="<%= image_url 'tpmo_img/item-04.jpg'%>" data-lightbox="image-1"><%= image_tag 'tpmo_img/project-item-04.jpg' %></a>
                  </div>
                  <div class="col-md-3 project-item">
                    <a href="<%= image_url 'tpmo_img/item-05.jpg'%>" data-lightbox="image-1"><%= image_tag 'tpmo_img/project-item-05.jpg' %></a>
                  </div>
                  <div class="col-md-3 project-item">
                    <a href="<%= image_url 'tpmo_img/item-06.jpg'%>" data-lightbox="image-1"><%= image_tag 'tpmo_img/project-item-06.jpg' %></a>
                  </div>
                  <div class="col-md-3 project-item">
                    <a href="<%= image_url 'tpmo_img/item-07.jpg'%>" data-lightbox="image-1"><%= image_tag 'tpmo_img/project-item-07.jpg' %></a>
                  </div>
                  <div class="col-md-3 project-item">
                    <a href="<%= image_url 'tpmo_img/item-08.jpg'%>" data-lightbox="image-1"><%= image_tag 'tpmo_img/project-item-08.jpg' %></a>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </li>

    <li>
      <div class="heading">
        <h1>Contact us</h1>
        <span>You'll be responded within 48 hrs</span>
      </div>
      <div class="cd-half-width fivth-slide">
        <div class="container">
          <div class="row">
            <div class="col-md-12">
              <div class="content fivth-content">
                <div class="row">
                  <div class="col-md-4">
                    <div class="left-info">
                      <p>Maecenas imperdiet sagittis lacus, ut consequat velit iaculis id. Praesent eu consequat urna.
                        Morbi justo dolor, ornare sed lorem et, auctor iaculis ligula.
                        <br><br>
                        <em>3344 Donec mollis libero<br>at metus luctus 10110</em>
                      </p>
                      <ul class="social-icons">
                        <i><a href="#"><i class="fa fa-facebook"></i></a></i>
                        <i><a href="#"><i class="fa fa-twitter"></i></a></i>
                        <i><a href="#"><i class="fa fa-linkedin"></i></a></i>
                        <i><a href="#"><i class="fa fa-rss"></i></a></i>
                        <i><a href="#"><i class="fa fa-behance"></i></a></i>
                      </ul>
                    </div>
                  </div>
                  <div class="col-md-8">
                    <div class="row">
                      <form id="contact" action="" method="post">
                        <div class="col-md-6">
                          <fieldset>
                            <input name="name" type="text" class="form-control" id="name" placeholder="Your Name" required="">
                          </fieldset>
                        </div>
                        <div class="col-md-6">
                          <fieldset>
                            <input name="email" type="email" class="form-control" id="email" placeholder="Email" required="">
                          </fieldset>
                        </div>
                        <div class="col-md-12">
                          <fieldset>
                            <textarea name="message" rows="6" class="form-control" id="message" placeholder="Message" required=""></textarea>
                          </fieldset>
                        </div>
                        <div class="col-md-12">
                          <fieldset>
                            <button type="submit" id="form-submit" class="btn">Send Message</button>
                          </fieldset>
                        </div>
                      </form>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </li>
  </ul> <!-- .cd-hero-slider -->
</section> <!-- .cd-hero -->


<footer>
  <!--<p>Copyright &copy; 2017 Your Company-->

    <!--| More Templates <a href="http://www.cssmoban.com/" target="_blank" title="模板之家">模板之家</a> - Collect from-->
    <!--<a href="http://www.cssmoban.com/" title="网页模板" target="_blank">网页模板</a>-->
  <!--</p>-->
</footer>

<!--<script src="js/vendor/jquery-1.11.2.min.js"></script>-->
<%= javascript_include_tag 'tpmo_js/vendor/jquery-1.11.2.min' %>
<script>window.jQuery || document.write('<script src="js/vendor/jquery-1.11.2.min.js"><\/script>')</script>

<%= javascript_include_tag 'tpmo_js/vendor/bootstrap.min' %>
<%= javascript_include_tag 'tpmo_js/plugins' %>
<%= javascript_include_tag 'tpmo_js/main' %>

</body>
</html>